var _inherit = require('core/inherit.js');
var _Container = require('component/container.js');
var _UIContainer = require('component/uicontainer.js');
var _vec3f = require('core/glm.js').vec3f;
var _global = require('global/global.js');
var _layout = require('tools/layout.js');
var _relative = _layout.relative;
var _TouchNode = require('event/touchnode.js').TouchNode;
var TWEEN = require('third_party/tweenjs/tween.js');

var _ButtonIds = require('event/buttonid.js');
var BUTTON_DOWN = _ButtonIds.BUTTON_DOWN;
var BUTTON_UP = _ButtonIds.BUTTON_UP;
var BUTTON_MOVE = _ButtonIds.BUTTON_MOVE;
var BUTTON_CANCEL = _ButtonIds.BUTTON_CANCEL;

var _UIUtils = require('scenes/game/utils.js');
var _Helper = require('scenes/widget/tweenhelp.js');
var _Statistics = require('config/statistics.js');// data
var S = require('res/style.js');
var _Constance = require('./constance.js');
var _Settings = require('scenes/constants.js');

var _Utility = require('scenes/utility.js');

// ==========================
// Line
// ==========================
function Line(name, count) {
    _Container.call(this);

    this.setSize(_Constance.lineSize);
    this.addChild(this.mBg = _UIUtils.inputBg(_Constance.lineSize[0]));
    this.addChild(this.mName = S.menu.statistics.linename.createText(name));
    this.addChild(this.mCount = S.menu.statistics.count.createText(count + ''));

    this.layout();
}
_inherit(Line, _Container);
Line.prototype.layout = function () {
    _relative.local.layoutTo(this.mBg, 0.5, 0, this, 0.5, 0);
    _relative.layoutTo(this.mCount, 0, 0.5, this.mBg, 0, 0.5, 20, 0);
    _relative.layoutTo(this.mName, 0, 0, this.mBg, 0, 1, 0, 4);
};

// ==========================
// Statistics
// ==========================
/**
 * @param record {score, cells}
 * @constructor
 */
function Statistics() {
    _Container.call(this);

    this.mLines = [];
    this.mLines.push(new Line('High Score', _Utility.numberFormat(_Statistics.getHighScore())));
    this.mLines.push(new Line('High Rank', _Statistics.getHighRank()));
    var gs = _Statistics.getGroups();
    for (var i = 0; i < gs.length; i++) {
        var data = gs[i];
        this.mLines.push(new Line("Most " + data.getRank() + "'s on a finished board", data.getCount()));
    }

    for (var i = 0; i < this.mLines.length; i++) {
        this.addChild(this.mLines[i]);
    }

    this.layout();
}
_inherit(Statistics, _Container);
Statistics.prototype.mTag = 'Statistics';
Statistics.prototype.layout = function () {
    var h = _Constance.lineSize[1];

    var marginTop = 0;
    var marginBottom = 20;
    var height = h * this.mLines.length + marginBottom + marginTop;
    var middle = _Constance.lineSize[1] * 0.5;

    var y = marginBottom;
    for (var i = this.mLines.length - 1; i > -1; i--) {
        this.mLines[i].setAnchor(0.5, 0);
        this.mLines[i].setPosition(middle, y);
        y += h;
    }
    this.setSize(middle * 2, height);
};

// ==========================
// ScrollView
// ==========================
function ScrollView() {
    _UIContainer.call(this);

    this.addChild(this.mView = new Statistics());
    this.mView.setAnchor(0.5, 1);
    this.setAnchor(0.5, 0);

    // bind to namespace menu
    this.mLocal = _Constance.getLocal();
    this.mLocal.add('touch.statistics', this);
    this.mTitle = this.mLocal.find('title_statis');

    // scroll
    this.mViewHeight = this.mView.getSize()[1];

    this.mScroll = 0;
    this.mMaxScroll = 0;
    this.mMarginTop = 30;// min scroll
    this.mMarginBottom = 50;// max scroll

    this.mViewPos = _Helper.createPoint();
    this.mViewPos.setDirection(0, 1);

    // used by absorb
    this.move = 0;
    this.mAnima = null;

    // touch
    this.mTouchDown = new _vec3f();
    this.mDownScroll = 0;

    this.layoutVertical(800);
    this.scrollTo(0);
}
_inherit(ScrollView, _UIContainer);
ScrollView.prototype.createEventNode = function () {
    return new _TouchNode(this);
};
/**
 * @param parenth
 */
ScrollView.prototype.layoutVertical = function (parenth) {
    var marginBottom = _Settings.adsHeight + 20;
    var h = parenth - _Constance.titleSize[1] - marginBottom;
    this.setSize(480, h);
    this.mPosition[1] = marginBottom;
    this.touchMatrix();

    var remain = this.mViewHeight - h;
    if (remain <= 0) {
        this.mMaxScroll = 0;
    } else {
        this.mMaxScroll = remain;
    }

    this.mViewPos.setPosition(240, h);
    var absorb = this.scrollTo(this.mScroll);
    if (absorb != 0) {
        this.mView.setPosition(this.mViewPos.getPosition(this.mScroll + absorb));
    }
};
/**
 * @param offset
 * @returns {number} offset exteeded
 */
ScrollView.prototype.scrollTo = function (offset) {
    var absorb = 0;

    if (offset > this.mMaxScroll) {
        offset -= this.mMaxScroll;
        if (offset > this.mMarginBottom) {
            this.mScroll = this.mMaxScroll + this.mMarginBottom;
            absorb = -this.mMarginBottom;
        } else {
            this.mScroll = this.mMaxScroll + offset;
            absorb = -offset;
        }
    } else if (offset < 0) {// min scroll
        offset = -offset;
        if (offset > this.mMarginTop) {
            this.mScroll = -this.mMarginTop;
            absorb = this.mMarginTop;
        } else {
            this.mScroll = -offset;
            absorb = offset;
        }
    } else {
        this.mScroll = offset;
    }

    this.mTitle.setScrollOffset(this.mScroll);
    this.mView.setPosition(this.mViewPos.getPosition(this.mScroll));
    return absorb;
};
ScrollView.prototype.startTouch = function (event) {
    this.mDownScroll = this.mScroll;
    this.mTouchDown.set(event.vector);
};
ScrollView.prototype.moveTouch = function (event) {
    var offset = event.vector[1] - this.mTouchDown[1];
    this.scrollTo(offset + this.mDownScroll);
};
ScrollView.prototype.onAbsorbComplete = function () {
    this.mAnima = null;
};
ScrollView.prototype.onAbsorb = function () {
    this.scrollTo(this.move);
};
ScrollView.prototype.endTouch = function (event) {
    var offset = event.vector[1] - this.mTouchDown[1];
    var absorb = this.scrollTo(offset + this.mDownScroll);
    if (absorb != 0) {
        if (Math.abs(absorb) < 5) {
            this.scrollTo(this.mScroll + absorb);
        } else {
            this.move = this.mScroll;
            this.mAnima = new TWEEN.Tween(this)
                .to({move: this.mScroll + absorb}, Math.abs(absorb) / 100)
                .easing(TWEEN.Easing.Quartic.Out)
                .onUpdate(this.onAbsorb)
                .onComplete(this.onAbsorbComplete)
                .start();
        }
    }
};
ScrollView.prototype.onTouch = function (event) {
    if (this.mAnima) {
        this.mAnima.stop();
        this.mAnima = null;
    }
    switch (event.state) {
        case BUTTON_DOWN:
            this.startTouch(event);
            break;
        case BUTTON_MOVE:
            this.moveTouch(event);
            break;
        case BUTTON_UP:
        case BUTTON_CANCEL:
            this.endTouch(event);
            break;
    }
    return false;
};

module.exports = ScrollView;